<template>
  <el-form :model="model" width='250' :rules="rulesForm" ref="dataForm">
                <el-form-item label="设备名称" label-width="80px"  prop="machinery_name">
                    <el-input v-model="model.machinery_name" placeholder="请输入设备名称" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="品牌" label-width="80px"  prop="machinery_brand">
                    <el-input v-model="model.machinery_brand" placeholder="请输入品牌" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="设备分类" label-width="80px" prop="machinery_type_name">
                    <el-input v-model="model.machinery_type_name"  @focus="SelectDem" placeholder="请选择设备分类" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="规格型号" label-width="80px"  prop="machinery_spec">
                    <el-input v-model="model.machinery_spec" placeholder="请输入规格型号" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="所属车间" prop="workshop_name" label-width="80px">
                    <el-select v-model="model.workshop_name" placeholder="请选择所属车间"  filterable allow-create default-first-option size="small" clearable>
                    <el-option label="尺寸" value="尺寸"></el-option>
                    <el-option label="外观" value="外观"></el-option>
                    <el-option label="重量" value="重量"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="是否启用" label-width="110px"  prop="status">
                    <el-radio v-model="model.status" label="0">启用</el-radio>
                    <el-radio v-model="model.status" label="1">停用</el-radio>
                </el-form-item>
                <el-form-item label="备注" prop="remark" label-width="80px" style="margin:15px 0px 15px 0px;">
                    <el-input v-model="model.remark" placeholder="请输入备注" autocomplete="off"></el-input>
                </el-form-item>

                <div style="text-align:right;">
                    <el-button @click="closeDialog" style="margin-right:10px;">取 消</el-button>
                    <el-button slot="reference" type="primary" @click="save">保 存</el-button>
                </div>
                
                <el-dialog class="box-dialog" width="45%"  :title="title" :visible.sync="dialogFormVisible" @close="closelog" :close-on-click-modal="false" append-to-body>
                    <Select @SelectChange="SelectChange"/>
                </el-dialog>
            </el-form>
            
</template>

<script>

import Select from './SelectType.vue';
export default {
    components:{
        Select
    },
    props:{
          model:{
              type:Object, //类型
              required:true, //必要性
          },
          isUpdate:Boolean
      },
    data(){
        return{
            rulesForm:{
                 machinery_name: [{ required: true, message: '请输入设备名称', trigger: 'blur' }],
            },
            title:'请输入设备编码',
            dialogFormVisible:false
        }
    },
    methods:{
        dataBind(){
            this.isloading=true,
            this.$http.request({
                type:'get',
                url:'/api/Equipmentledger',
                params:{
                    machinery_type_name:this.model.machinery_type_name,
                    PageIndex:this.PageIndex,
                    PageSize:this.PageSize
                }
            }).then(res=>{
                console.log(res);
                if(res.data.code==200){
                    this.tableData = res.data.data;
                    this.total = res.data.count;
                }
            }).catch(err=>{
            }).finally(()=>{
                this.isloading=false;
            })
        },

        save(){
            this.$refs.dataForm.validate((valid)=>{
                if (valid) {
                    if(this.isUpdate)
                    {
                        console.log(111);
                        this.$http.putForm('/api/Equipmentledger',{model:this.model})
                        .then(res =>{
                            console.log(res);
                            if(res.data.code == 200){
                                this.ShowMsg(res.data.msg,'success');
                                this.$emit('dataBind');
                                this.closeDialog();
                            }
                        })
                        .catch(err =>{
                            this.ShowMsg('服务器异常','error');
                        })
                    }
                    else{
                        console.log(222);
                        this.$http.postForm('/api/Equipmentledger',{model:this.model})
                        .then(res=>{
                        console.log(res);
                        if(res.data.code==200){
                            this.ShowMsg(res.data.msg,'success');
                            this.$emit('dataBind')
                            this.closeDialog();
                        }
                        else{

                        }})
                        .catch(err=>{

                        })
                    
                    }
                } else {
                        console.log('error submit!!');
                        return false;
                    }
            })

           
        },
        SelectDem(){
            this.dialogFormVisible=true;
        },
        SelectChange(e){
           this.model.machinery_type_name=e.machinery_type_name;
           this.model.machinery_type_id= e.machinery_type_id;
           console.log(this.model);
           this.dialogFormVisible=false;
        },
        closeDialog(){
          this.$emit('closeDialog')
        },
        closelog(){
            this.dialogFormVisible=false;
        }
    },
    created(){
        this.dataBind();
    }
}

</script>

<style>

</style>